// @vitest-environment jsdom
//
// `/docs/[...slug]` catch-all — its `getStaticPaths` export (enumerates the
// pre-rendered doc slugs) and the localized page render for a matched vs.
// unknown slug. The page reads the captured slug via `useParams` (mocked to
// drive the slug) and its per-locale prose via @voltro/i18n (mocked to resolve
// against the real catalogs for a controllable "current locale").

import { afterEach, beforeEach, describe, expect, test, vi } from 'vitest'
import { act, createElement, type ReactNode } from 'react'
import { createRoot, type Root } from 'react-dom/client'
import en from '../../../locales/en'
import de from '../../../locales/de'

const params = vi.fn<() => Record<string, string>>()
vi.mock('@voltro/web', () => ({ useParams: () => params() }))

const catalogs: Record<string, Record<string, string>> = { en, de }
let currentLocale = 'en'

const fill = (msg: string, values?: Record<string, unknown>): string =>
  values ? msg.replace(/\{(\w+)\}/g, (_, k: string) => String(values[k] ?? `{${k}}`)) : msg

vi.mock('@voltro/i18n', () => ({
  // The locale catalogs call these at module top-level; identity mirrors the
  // real (compile-time-only) implementations so importing them doesn't throw.
  defineCatalog: <T,>(c: T): T => c,
  defineLocale:
    () =>
    <T,>(c: T): T =>
      c,
  useTFn:
    () =>
    (id: string, values?: Record<string, unknown>) =>
      fill(catalogs[currentLocale]?.[id] ?? id, values),
  T: ({ id, values }: { id: string; values?: Record<string, unknown> }) =>
    fill(catalogs[currentLocale]?.[id] ?? id, values),
}))

const { default: DocPage, getStaticPaths, meta, renderMode, interactive } = await import('./page')

;(globalThis as { IS_REACT_ACT_ENVIRONMENT?: boolean }).IS_REACT_ACT_ENVIRONMENT = true

let container: HTMLDivElement
let root: Root

const render = (node: ReactNode): void => {
  container = document.createElement('div')
  document.body.appendChild(container)
  act(() => {
    root = createRoot(container)
    root.render(node)
  })
}

beforeEach(() => params.mockReset())

afterEach(() => {
  currentLocale = 'en'
  if (root) act(() => root.unmount())
  container?.remove()
  document.body.innerHTML = ''
})

describe('docs [...slug] — config + getStaticPaths', () => {
  test('is a static page with no client JS', () => {
    expect(renderMode).toBe('static')
    expect(interactive).toBe('none')
  })

  test('enumerates every doc slug as a single `/`-joined string', async () => {
    const paths = await getStaticPaths()
    expect(paths.map((p) => p.params.slug)).toEqual([
      'intro/getting-started',
      'guides/first-page',
    ])
  })
})

describe('docs [...slug] — localized meta', () => {
  test('reads the per-doc title from the catalog, per locale', () => {
    expect(meta({ locale: 'en', params: { slug: 'guides/first-page' } }).title).toBe('Your first page')
    expect(meta({ locale: 'de', params: { slug: 'guides/first-page' } }).title).toBe('Deine erste Seite')
  })

  test('falls back to the not-found title for an unknown slug', () => {
    expect(meta({ locale: 'en', params: { slug: 'does/not-exist' } }).title).toBe('Not found')
  })
})

describe('docs [...slug] — localized render', () => {
  test('renders the matched doc title + body (English) for a known slug', () => {
    currentLocale = 'en'
    params.mockReturnValue({ slug: 'guides/first-page' })
    render(createElement(DocPage))
    expect(container.querySelector('h1')?.textContent).toBe('Your first page')
    expect(container.textContent).toContain('Drop a')
  })

  test('renders the matched doc title + body (German) for a known slug', () => {
    currentLocale = 'de'
    params.mockReturnValue({ slug: 'guides/first-page' })
    render(createElement(DocPage))
    expect(container.querySelector('h1')?.textContent).toBe('Deine erste Seite')
    expect(container.textContent).toContain('Lege eine')
  })

  test('renders the localized not-found fallback for an unknown slug', () => {
    currentLocale = 'en'
    params.mockReturnValue({ slug: 'does/not-exist' })
    render(createElement(DocPage))
    expect(container.querySelector('h1')?.textContent).toBe('Not found')
    expect(container.textContent).toContain('does/not-exist')
  })
})
